<template>
  <div class="nav-right">
    <div v-if="loginState">
      <nuxt-link to="/login">登录</nuxt-link>/
      <nuxt-link to="/login">注册</nuxt-link>
    </div>
    <UserProfile v-else />
    <Vip />
    <Footprint />
    <News />
    <Messages />
    <ZoneAuthor />
  </div>
</template>

<script lang='ts'>
import { Component, Vue } from "nuxt-property-decorator";

@Component
export default class extends Vue {
  loginState: boolean = false;
}
</script>

<style lang='less' scoped>
.nav-right {
  .flex-box(row, flex-end);
  a {
    .wh(auto, 48px);
    display: inline-block;
    line-height: 48px;
    color: #222;
    &:hover {
      text-decoration: none;
    }
  }
}
</style>